<!DOCTYPE html>
<html >
	<head>
		<meta charset="utf-8">
		<title>事件绑定</title>
	</head>
	<body>
		<div id="app" v-cloak @click="">
			姓氏	<input type="text"  v-model.lazy="firstname"/><br>
			名字	<input type="text"  v-model.lazy="lastname"/><br>
			全名 {{msg}}
		</div>
	</body>
</html>
<script src="../js/vue.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript"> 
	var v=new Vue({
		el:"#app",
		data:{
			firstname:"",
			lastname:"",
			fullname:"",
			msg:""
		},
		methods:{
			checkname(val){
				if(val==="tom"){
					this.msg="数据已经存在"
					return
				}
				else if(val==="admin"){
					this.msg="数据已经存在"
					return
				}else{
					this.msg="数据可以使用"
				}
			}
		},
		computed:{
			reverse(){
				return this.lengt.split("").reverse().join("");
			}
		},
		watch:{
			firstname(value){
				this.fullname=value+this.lastname;
			},
			lastname(value){
				this.fullname=this.firstname+value;
			},
			fullname(val){
				this.checkname(val)
			}
		}
	});
</script>
